#{extends 'map.html' /}
#{set title:'Dojo' /}

#{set 'moreStyles'}
    <link rel="stylesheet" type="text/css" media="screen" href="@{'/public/stylesheets/base_style.css'}">
    <link rel="stylesheet" type="text/css" media="screen" href="@{'/public/stylesheets/common.css'}">
    <link rel="stylesheet" type="text/css" media="screen" href="@{'/public/stylesheets/albums.css'}">
    <link rel="stylesheet" type="text/css" media="screen" href="@{'/public/stylesheets/album.css'}">
    <link rel="stylesheet" type="text/css" media="screen" href="@{'/public/stylesheets/photo.css'}">
    <link rel="stylesheet" type="text/css" media="screen" href="@{'/public/stylesheets/header.css'}">
    <link rel="stylesheet" type="text/css" media="screen" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.0/js/dojo/dijit/themes/tundra/tundra.css">
<style>
    #map{ margin: 0; padding: 0; }
    #feedback {
        background: #fff;
        bottom: 30px;
        color: #444;
        position: absolute;
        font-family: arial;
        height: auto;
        left: 30px;
        margin: 5px;
        padding: 10px;
        width: 300px;
        z-index: 40;
    }

    .shadow {
        -moz-box-shadow: 0 0 5px #888;
        -webkit-box-shadow: 0 0 5px #888;
        box-shadow: 0 0 5px #888;
    }
</style>
#{/set}

#{set 'moreScripts'}
    <script src="@{'/public/javascripts/footer.js'}" type="text/javascript" charset="${_response_encoding}"></script>
<!--<script src="@{'/public/javascripts/config/config.js'}" type="text/javascript" charset="${_response_encoding}"></script>-->
<!--<script src="@{'/public/javascripts/dojo-release-1.7.2/dojo/dojo.js'}" data-dojo-config="async: true, parseOnLoad:true, isDebug:false" type="text/javascript" charset="${_response_encoding}"></script>-->
    <script type="text/javascript" charset="${_response_encoding}">
        console.info(location.pathname);

        var dojoConfig = {
            parseOnLoad: true,
            packages: [{
            "name": "extras",
            "location": "/public/javascripts/extras"
            }]
        };
    </script>
<script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=3.0"></script>
<script src="@{'/public/javascripts/map/arcgishello.js'}" type="text/javascript" charset="${_response_encoding}"></script>
<script src="@{'/public/javascripts/gallerySample.js'}" type="text/javascript" charset="${_response_encoding}"></script>
#{/set}
*{#{kostroma /}}*
*{#{welcome /}}*
*{#{header /}}*
*{#{footer /}}*
<!--<h1>Hello World Example</h1>-->
<!--<hr/>-->
<!--<label for="txtName">Your Name:</label>-->
<!--<input id="txtName" type="text" dojoType="dijit.form.TextBox"/><br/>-->
<!--<button id="btnSayHello" dojoType="dijit.form.Button">Say Hello</button>-->
<div data-dojo-type="dijit.layout.BorderContainer"
     data-dojo-props="design:'headline',gutters:false"
     style="width: 100%; height: 100%; margin: 0;">
    <div id="map"
         data-dojo-type="dijit.layout.ContentPane"
         data-dojo-props="region:'center'">

        <div id="feedback" class="shadow">
            Click the map to search Seat Geek for events within 20 miles of the click point. Results are logged to the browser's console.
        </div>
    </div>
</div>